<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        html,
        body {
            height: 100%;
            margin: 0;
        }

        table {
            width: 100%;
            height: 100%;
            text-align: center;
            /* 边框合并 */
            border-collapse: collapse;
        }

        #tr1 {
            height: 50px;
            font-size: 30px;
        }

        #td2 {
            width: 150px;
        }

        #tr3 {
            height: 30px;
        }
        #quit{
            float: right;
            margin-right: 10px;
            font-size: 13px;
            line-height: 30px;
            /* 鼠标形状 */
            cursor: pointer;
        }
        #quit:hover{
            color:cornflowerblue;
        }
    </style>
</head>

<body>
    <table border="1">
        <tr id="tr1">
            <td colspan="2" style="color:#33FFFF">
                个人网站<span id="quit" onclick="quit()">退出</span>
            </td>
        </tr>
        <tr>
            <td id="td2">
                <img src="image/logo.jpg" width="80px" alt="">
                <a href="我的主页.html" target="myid" style="color: #D87093;">
                    <h3>我的主页</h3>
                </a>
                <a href="我的相册.html" target="myid" style="color: #FFC0CB	;">
                    <h3>我的相册</h3>
                </a>
                <a href="我的资料.html" target="myid" style="color: #BA55D3	;">
                    <h3>我的资料</h3>
                </a>
                <a href="">
                    <h3>联系我</h3>
                </a>
            <td><iframe name="myid" src="我的主页.html" frameborder="0" scrolling="no" width="100%" height="100%"></iframe>
            </td>
        </tr>
        <tr id="tr3">
            <td colspan="2" style="color:#0000FF">
                &copy;2021 炫小迈
            </td>
        </tr>
    </table>
    <script>
        function quit(){
            // 1.清除localStorgae
            localStorage.removeItem("username");
            localStorage.removeItem("password");
            // 2.跳转到注册页面
            location.href = "注册页面.html";
        }
    </script>
</body>

</html>